*{
	box-sizing: border-box;
	border-collapse: collapse;
}

.icon::before{
	display: inline;
	vertical-align: middle;
	margin-right: 7px;
}

.icon-peach::before{
	content: url(../images/icon/icon-peach.png);
}

.icon-search::before{
	content: url(../images/icon/icon-search.png);
}

.icon-apple::before{
	content: url(../images/icon/icon-apple.png);
}

.icon-index::before{
	content: url(../images/icon/icon-index.png);
}

body{
	background-color: #e8e8e8;
	z-index: -9999;
}

.nav-aside{
	position: fixed;
	width: 15%;
	height: 100vh;
	z-index: 999;
	/* border: 1px solid sienna; */
	background-color: #232323;
}

.main-container{
	margin-left: 15%;
	width: 85%;
	height: 100vh;
	/* border: 1px solid sienna; */
}

.nav-aside .top-img{
	width: 100%;
	height: 140px;
	background-size: cover;
	background-position: center;
	background-image: url(../images/img-clinet-nav.jpg);
}

.nav-aside .input-box{
	width: 85%;
	margin: 17px auto;
	text-align: center;
	/* border: 1px solid sienna; */
	background-color: #181818;
	border-radius: 4px;
}

.nav-aside .input-box input{
	width: 80%;
	border: none;
	background: none;
	outline: none;
	color: #FCFCFC;
	font-size: 12px;
	
	vertical-align: middle;
	display: inline-block;
	line-height: 24px;
}

.nav-aside .nav-main li:hover{
	background-color: #181818;
}

.nav-aside .nav-main li a{
	padding: 15px 17px;
	text-align: center;
	font-size: 14px;
}

.li-active{
	background-color: #181818;
}

.main-container .main-header{
	position: fixed;
	width: 85%;
	z-index: 2;
	height: 47px;
	background-color: white;
	box-shadow: 0 4px 3px rgba(80, 80, 80, .3);
	display: flex;
	justify-content: space-between;
	align-items: center;
	
	padding-left: 7px;
	padding-right: 7px;
}

.main-header .main-header-right-box {
	
}

.main-container .main-header h2{
	font: 14px/1.5 Tahoma,Helvetica,Arial,'宋体',sans-serif;
}

.main-container .card-box{
	background-color: white;
	box-shadow: 0 4px 3px rgba(80, 80, 80, .3);
	border-radius: 4px;
	margin-top: 7px;
	
	padding: 7px;
}

.line-divider{
	width: 80%;
	height: 1px;
	background-color: rgba(80, 80, 80, .2);
	margin: 7px auto;
}

.main-container .main-box{
	width: 100%;
	float: inherit;
	height: fit-content;
	margin: 0 auto;
	padding-top: 47px;
	padding-bottom: 7px;
}

.main-container .main-box>.main-div-box{
	margin-top: 37px;
	height: fit-content;
	overflow: hidden;
}

.main-container .main-row1 {
	display: flex;
	justify-content: space-around;
}

.main-container .letter-box{
	width: 20%;
	min-width: 200px;
	min-height: 30vh;
	height: fit-content;
}

h3{
	font-family: 'Microsoft YaHei',arial,tahoma,\5b8b\4f53,sans-serif;
	font-size: 0.97em;
	color: #707070;
	text-align: center;
}

.letter-box h3 {
	margin: 3% auto;
}

.letter-box .letter-text-p{
	margin: 7% auto;
	padding: 7px 10%;
}

.letter-box .letter-text{
	font-size: 14px;
	color: #5e5e5e;
}

.letter-box .letter-from::before{
	content: '——';
	display: inline-block;
	text-align: right;
}

.letter-box .letter-from{
	margin-top: 6%;
	font-size: 14px;
	color: #585858;
	display: block;
	text-align: right;
}

.main-box .statis-yesterday{
	width: 27%;
	min-width: 270px;
	height: 30vh;
	padding: 7px 17px;
	margin-left: 17px;
	background-color: white;
}

.main-box .statis-yesterday #sta1-chart{
	width: 100%;
	height: 100%;
	font-size: 12px;
}

.main-box .message-row1-box {
	height: 30vh;
}

.main-box .message-box{
	padding: 2% 7%;
	width: 37%;
	min-width: 370px;
	height: 30%;
	padding: 10px 24px;
}

.message-box .line-divider {
	width: 90%;
}

.main-box .message-text-box{
	display: block;
	text-align: left;
	font-size: 14px;
	color: #5e5e5e;
	width: 90%;
	margin: 1% auto;
}

.main-box .message-text-box .msg-from{
	color: #26C6DA;
}

.main-box .message-text-box .msg-from::after{
	content: ': ';
}

.main-box .receive-box{
	position: relative;
	width: 37%;
	min-width: 370px;
	height: 30%;
	text-align: center;
	transition: .2s;
}

.main-box .button-box{
	position: absolute;
	width: calc(374px - 17px);
	bottom: 17px;
	text-align: center;
}

.main-box .button-box button{
	outline: none;
	border: none;
	
	border-radius: 10px;
	background-color: #26C6DA;
	width: 170px;
	padding: 7px 17px;
	cursor: pointer;
	
	font-size: 17px;
}

.main-box .send-paper-box{
	background-color: #fefefe;
	width: 22%;
	min-width: 420px;
}

.send-paper-box form{
	width: 100%;
	padding: 2% 8%;
}

.send-paper-box .line-divider{
	width: 84%;
}

.send-paper-box form input{
	line-height: 28px;
	width: 100%;
	background-color: #F5F5F5;
	padding: 3px 5%;
	border: none;
	outline: none;
}

.send-paper-box form #paper-content{
	margin-top: 3%;
	border: 0;
	border-radius: 5px;
	background-color:rgba(241,241,241,.98);
	width: 100%;
	height: 100px;
	padding: 5%;
	resize: none;
}

.send-paper-box form #btn-submit{
	background-color: #a3a3a3;
	border-radius: 4px;
	cursor: pointer;
	margin-top: 2%;
}

.main-box .my-paper-box{
	font-size: 14px;
	max-width: 70%;
	min-width: 700px;
	padding: 7px 17px;
}

.main-box .my-paper-box table{
	width: 100%;
}

.my-paper-box th,.my-paper-box td{
	text-align: center;
}

.main-box .my-paper-box th{
	line-height: 27px;
}

.main-box .my-paper-box td{
	font-size: 12px;
	line-height: 24px;
}

.main-box .my-paper-box thead{
	height: 37px;
}

.main-box .my-paper-box tr:nth-child(even){
	background-color: #f7f7f7;
}

.main-box .my-paper-box a{
	color: #ef0b4f;
}